<template>
    <div>
        <h3>添加页面</h3>
        <table class="table table-bordered">
            <tbody>
                <tr>
                    <td align="right">姓名</td>
                    <td>
                        <input type="text" v-model="info.jobeName">
                    </td>
                </tr>
                <tr>
                    <td align="right">手机号</td>
                    <td>
                        <input type="text" v-model="info.jobeTel" maxlength="11">
                    </td>
                </tr>
                <tr>
                    <td align="right">证件类型</td>
                    <td>
                        <select v-model="info.jobePet">
                            <option value="">请选择</option>
                            <option v-for="item in type" :value="item">{{item}}</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td align="right">证件号码</td>
                    <td>
                        <input type="text" v-model="info.jobeNumber" maxlength="18">
                    </td>
                </tr>
                <tr>
                    <td align="right">性别</td>
                    <td>
                        <input type="radio" name="sex" value="0" v-model="info.jobeSex">男
                        <input type="radio" name="sex" value="1" v-model="info.jobeSex">女
                    </td>
                </tr>
                <tr>
                    <td align="right">生日</td>
                    <td>
                        <input type="date" v-model="info.jobeTime">
                    </td>
                </tr>
                <tr>
                    <td align="right">职业</td>
                    <td>
                        <select v-model="info.jobeTypeId">
                            <option value="">请选择</option>
                            <option v-for="item in bang" :value="item.jobeTypeId">{{item.jobeTypeName}}</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td align="right">详细地址</td>
                    <td>
                        <input type="text" v-model="info.jobeAddre">
                    </td>
                </tr>
                <tr>
                    <td></td>
                    <td>
                        <input type="button" value="重置" class="btn btn-secondary" @click="Chong">
                        <input type="button" value="确定" class="btn btn-success" @click="Add">     
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</template>

<script setup lang="ts">
import{ref,reactive,onMounted}from 'vue'
import axios from 'axios';
import { useRouter ,useRoute} from 'vue-router';
const router=useRouter();
const route=useRoute();
onMounted(()=>{
    BangType();
})
//定义证件类型
 let type:any=ref(["身份证","军官证","护照"])
//定义数组存放下拉框
let bang:any=ref([])
const BangType=()=>{
    axios({
        url:'/api/Jobs/BangJobeType',
        method:'get',
    })
    .then((res)=>{
        console.log(res);
        bang.value=res.data
    })
    .catch((err)=>{
        console.log(err);
        
    })
}
//重置
const Chong=()=>{
    info.jobeName='';
    info.jobeTel='';
    info.jobePet='';
    info.jobeNumber='';
    info.jobeSex='';
    info.jobeTime='';
    info.jobeTypeId='';
    info.jobeAddre='';
}
//添加
let info:any=reactive({
    "jobeName": "",
    "jobeTel": "",
    "jobePet": "",
    "jobeNumber": "",
    "jobeSex": 0,
    "jobeTime": "",
    "jobeTypeId": '',
    "jobeAddre": "",
})
const Add=()=>{
    if(info.jobeName==""){
        alert('姓名不能为空')
        return;
    }   
    if(info.jobeTel==""){
        alert('手机号不能为空')
        return;
    } 
    var f=/^1[3-9]\d{9}/;
    if(!f.test(info.jobeTel)){
        alert('手机号不合法')
        return;
    } 
    if(info.jobePet==""){
        alert('证件类型不能为空')
        return;
    } 
    if(info.jobeNumber==""){
        alert('证件号码不能为空')
        return;
    }
    if(info.jobeSex==""){
        alert('性别不能为空')
        return;
    }
    if(info.jobeTime==""){
        alert('生日不能为空')
        return;
    }
    if(info.jobeTypeId==""){
        alert('职业类型不能为空')
        return;
    }
    if(info.jobeAddre==""){
        alert('地址不能为空')
        return;
    }
    axios({
        url:'/api/Jobs/AddJobe',
        method:'post',
        data:info
    })
    .then((res)=>{
        console.log(res);
        if(res.data==-1){
            alert('姓名重复')
            return;
        }
        if(res.data>0){
            alert('添加成功')
            router.push('/showjobs')
            return;
        }
        else{
            alert('添加失败')
            return;
        }
    })
    .catch((err)=>{
        console.log(err);
        
    })
}
</script>
<style scoped>

</style>